<template>
  <div class="app-container">
    <!-- 查询和其他操作 -->
    <div class="filter-container">
      <span>设备号:</span>
      <el-input
        v-model="listQuery.vin"
        size="small"
        class="filter-item"
        style="width: 200px;"
        clearable
        placeholder="请输入设备编号"
        @keyup.enter.native="handleFind"
      />
      <el-button
        class="filter-item"
        type="primary"
        icon="el-icon-search"
        size="mini"
        @click="handleFind"
      >查找
      </el-button>
    </div>
    <el-table
      v-loading="loading"
      :data="tableData"
      style="width: 100%"
      size="mini"
      highlight-current-row
    >
      <el-table-column label="序号" width="60" align="center">
        <template slot-scope="scope">
          <span>{{ scope.$index + 1 }}</span>
        </template>
      </el-table-column>
      <el-table-column label="设备号" width="150" align="center">
        <template slot-scope="scope">
          <span>{{ scope.row.vin }}</span>
        </template>
      </el-table-column>
      <el-table-column label="数据时间" width="160" align="center">
        <template slot-scope="scope">
          <span>{{ scope.row.dataTime }}</span>
        </template>
      </el-table-column>
      <el-table-column label="运行模式" width="100" align="center">
        <template slot-scope="scope">
          <span>{{ scope.row.runModelName }}</span>
        </template>
      </el-table-column>
      <el-table-column label="交流电压给定" width="100" align="center">
        <template slot-scope="scope">
          <span>{{ scope.row.acVoltageGive }}</span>
        </template>
      </el-table-column>
      <el-table-column label="有功功率给定" width="100" align="center">
        <template slot-scope="scope">
          <span>{{ scope.row.acActivePowerGive }}</span>
        </template>
      </el-table-column>
      <el-table-column label="无功功率给定" width="100" align="center">
        <template slot-scope="scope">
          <span>{{ scope.row.acReactivePowerGive }}</span>
        </template>
      </el-table-column>
      <el-table-column label="经度" width="100" align="center">
        <template slot-scope="scope">
          <span>{{ scope.row.longitude }}</span>
        </template>
      </el-table-column>
      <el-table-column label="纬度" width="100" align="center">
        <template slot-scope="scope">
          <span>{{ scope.row.latitude }}</span>
        </template>
      </el-table-column>
      <el-table-column label="在线状态" width="100" align="center">
        <template slot-scope="scope">
          <span>{{ scope.row.online == 0?"在线":"离线" }}</span>
        </template>
      </el-table-column>
      <el-table-column label="告警情况" width="100" align="center">
        <template slot-scope="scope">
          <span>{{ scope.row.alarm == 0?"有告警":"无告警" }}</span>
        </template>
      </el-table-column>
      <!--数据操作-->
      <el-table-column label="操作" header-align="center" width="185" align="center">
        <template slot-scope="scope">
          <el-button type="success" size="mini" @click="handleView(scope.row)">详情</el-button>
        </template>
      </el-table-column>
    </el-table>
    <!--分页-->
    <div class="block">
      <el-pagination
        layout="total, prev, pager, next,sizes, jumper"
        :page-sizes="[10, 20, 30, 50]"
        :current-page.sync="listQuery.current"
        :page-size="listQuery.size"
        :total="listQuery.total"
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
      />
    </div>
    <!-- 查看数据对话框 -->
    <el-dialog :fullscreen="true" :visible.sync="dialogVisible" center>
      <el-card style="margin-bottom: 20px">
        <el-row>
          <el-col :span="5">
            站点序号:{{ selectedData.vin }}
          </el-col>
          <el-col :span="5">
            最新数据时间:{{ selectedData.dataTime }}
          </el-col>
          <el-col :span="5">
            运行模式:{{ selectedData.runModelName }}
          </el-col>
          <el-col :span="5">
            在线状态:{{ selectedData.online == 0?"在线":"离线" }}
          </el-col>
          <el-col :span="4">
            告警情况:{{ selectedData.alarm== 0?"有告警":"无告警" }}
          </el-col>
        </el-row>
      </el-card>
      <el-tabs v-model="activeNames" type="border-card" @tab-click="handleChange">
        <el-tab-pane label="整机运行参数" name="0">
          <el-table
            :data="allParameters"
            style="width: 100%"
            size="mini"
            highlight-current-row
          >
            <el-table-column label="数据时间" width="160" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.dataTime }}</span>
              </template>
            </el-table-column>
            <el-table-column label="上电时间" width="100" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.powerOnTime }}</span>
              </template>
            </el-table-column>
            <el-table-column label="运行时间" width="100" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.runTime }}</span>
              </template>
            </el-table-column>
            <el-table-column label="运行状态" width="100" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.runStatusName }}</span>
              </template>
            </el-table-column>
            <el-table-column label="运行模式" width="100" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.runModelName }}</span>
              </template>
            </el-table-column>
            <el-table-column label="电网频率" width="100" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.frequency }}</span>
              </template>
            </el-table-column>
            <el-table-column label="温度1" width="100" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.temperature1 / 10 }}</span>
              </template>
            </el-table-column>
            <el-table-column label="温度2" width="100" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.temperature2 / 10 }}</span>
              </template>
            </el-table-column>
            <el-table-column label="温度3" width="100" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.temperature3 / 10 }}</span>
              </template>
            </el-table-column>
            <el-table-column label="温度4" width="100" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.temperature4 / 10 }}</span>
              </template>
            </el-table-column>
            <el-table-column label="交流有功" width="100" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.alternatingActivePower }}</span>
              </template>
            </el-table-column>
            <el-table-column label="交流无功" width="100" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.alternatingReactivePower }}</span>
              </template>
            </el-table-column>
            <el-table-column label="负载有功" width="100" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.loadActivePower }}</span>
              </template>
            </el-table-column>
            <el-table-column label="负载无功" width="100" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.loadReactivePower }}</span>
              </template>
            </el-table-column>
            <el-table-column label="逆变有功" width="100" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.inverterActivePower }}</span>
              </template>
            </el-table-column>
            <el-table-column label="逆变无功" width="100" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.inverterReactivePower }}</span>
              </template>
            </el-table-column>
          </el-table>
          <!--分页-->
          <div class="block">
            <el-pagination
              layout="total, prev, pager, next,sizes, jumper"
              :page-sizes="[10, 20, 30, 50]"
              :current-page.sync="listQuery1.current"
              :page-size="listQuery1.size"
              :total="listQuery1.total"
              @size-change="handleSizeChange1"
              @current-change="handleCurrentChange1"
            />
          </div>
        </el-tab-pane>
        <el-tab-pane label="储能装置电压电流数据" name="1">
          <el-table
            :data="energyStorage"
            style="width: 100%"
            size="mini"
            highlight-current-row
          >
            <el-table-column label="数据时间" width="160" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.dataTime }}</span>
              </template>
            </el-table-column>
            <el-table-column label="电网电压有效值" width="120" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.gridVoltageEft / 10 }}</span>
              </template>
            </el-table-column>
            <el-table-column label="电网电流有效值" width="120" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.gridCurrentEft / 10 }}</span>
              </template>
            </el-table-column>
            <el-table-column label="负载电压有效值" width="120" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.loadVoltageEft / 10 }}</span>
              </template>
            </el-table-column>
            <el-table-column label="负载电流有效值" width="120" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.loadCurrentEft / 10 }}</span>
              </template>
            </el-table-column>
            <el-table-column label="逆变电压有效值" width="120" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.invertVoltageEft / 10 }}</span>
              </template>
            </el-table-column>
            <el-table-column label="逆变电流有效值" width="120" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.invertCurrentEft / 10 }}</span>
              </template>
            </el-table-column>
            <el-table-column label="电网电压直流值" width="120" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.gridVoltageDc / 10 }}</span>
              </template>
            </el-table-column>
            <el-table-column label="电网电流直流值" width="120" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.gridCurrentDc / 10 }}</span>
              </template>
            </el-table-column>
            <el-table-column label="负载电压直流值" width="120" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.loadVoltageDc / 10 }}</span>
              </template>
            </el-table-column>
            <el-table-column label="负载电流直流值" width="120" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.loadCurrentDc / 10 }}</span>
              </template>
            </el-table-column>
            <el-table-column label="逆变电压直流值" width="120" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.invertVoltageDc / 10 }}</span>
              </template>
            </el-table-column>
            <el-table-column label="逆变电流直流值 " width="120" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.invertCurrentDc / 10 }}</span>
              </template>
            </el-table-column>
            <el-table-column label="BUS 电压直流值" width="120" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.busVoltageDc / 10 }}</span>
              </template>
            </el-table-column>
            <el-table-column label="BUS 电流直流值" width="120" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.busCurrentDc / 10 }}</span>
              </template>
            </el-table-column>
            <el-table-column label="BAT 电压直流值" width="120" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.batVoltageDc / 10 }}</span>
              </template>
            </el-table-column>
            <el-table-column label="BAT 电流直流值" width="120" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.batCurrentDc / 10 }}</span>
              </template>
            </el-table-column>
          </el-table>
          <!--分页-->
          <div class="block">
            <el-pagination
              layout="total, prev, pager, next,sizes, jumper"
              :page-sizes="[10, 20, 30, 50]"
              :current-page.sync="listQuery2.current"
              :page-size="listQuery2.size"
              :total="listQuery2.total"
              @size-change="handleSizeChange2"
              @current-change="handleCurrentChange2"
            />
          </div>
        </el-tab-pane>
        <el-tab-pane label="电池箱体电压数据" name="2">
          <el-table
            :data="batteryVoltage"
            style="width: 100%"
            size="mini"
            highlight-current-row
          >
            <el-table-column label="数据时间" width="160" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.dataTime }}</span>
              </template>
            </el-table-column>
            <el-table-column label="电池箱体编号" width="100" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.bodyNo1 }}</span>
              </template>
            </el-table-column>
            <el-table-column label="总电压" width="100" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.allVoltage1 / 10 }}</span>
              </template>
            </el-table-column>
            <el-table-column label="电压列表" align="center">
              <template slot-scope="scope">
                <el-button type="success" size="mini" @click="showVoltageList(scope.row.voltageList1)">详情</el-button>
              </template>
            </el-table-column>
            <el-table-column label="电池箱体编号" width="100" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.bodyNo2 }}</span>
              </template>
            </el-table-column>
            <el-table-column label="总电压" width="100" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.allVoltage2 / 10 }}</span>
              </template>
            </el-table-column>
            <el-table-column label="电压列表" align="center">
              <template slot-scope="scope">
                <el-button type="success" size="mini" @click="showVoltageList(scope.row.voltageList2)">详情</el-button>
              </template>
            </el-table-column>
            <el-table-column label="电池箱体编号" width="100" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.bodyNo3 }}</span>
              </template>
            </el-table-column>
            <el-table-column label="总电压" width="100" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.allVoltage3 / 10 }}</span>
              </template>
            </el-table-column>
            <el-table-column label="电压列表" align="center">
              <template slot-scope="scope">
                <el-button type="success" size="mini" @click="showVoltageList(scope.row.voltageList3)">详情</el-button>
              </template>
            </el-table-column>

            <el-table-column label="电池箱体编号" width="100" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.bodyNo4 }}</span>
              </template>
            </el-table-column>
            <el-table-column label="总电压" width="100" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.allVoltage4 / 10 }}</span>
              </template>
            </el-table-column>
            <el-table-column label="电压列表" align="center">
              <template slot-scope="scope">
                <el-button type="success" size="mini" @click="showVoltageList(scope.row.voltageList4)">详情</el-button>
              </template>
            </el-table-column>

            <el-table-column label="查看所有" align="center">
              <template slot-scope="scope">
                <el-button type="success" size="mini" @click="showAllVoltage(scope.row.voltageAll)">查看所有</el-button>
              </template>
            </el-table-column>
          </el-table>
          <!--分页-->
          <div class="block">
            <el-pagination
              layout="total, prev, pager, next,sizes, jumper"
              :page-sizes="[10, 20, 30, 50]"
              :current-page.sync="listQuery3.current"
              :page-size="listQuery3.size"
              :total="listQuery3.total"
              @size-change="handleSizeChange3"
              @current-change="handleCurrentChange3"
            />
          </div>
        </el-tab-pane>
        <el-tab-pane label="电池箱体温度数据" name="3">
          <el-table
            :data="batteryTemperature"
            style="width: 100%"
            size="mini"
            highlight-current-row
          >
            <el-table-column label="数据时间" width="160" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.dataTime }}</span>
              </template>
            </el-table-column>
            <el-table-column label="电池箱体编号" width="100" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.bodyNo1 }}</span>
              </template>
            </el-table-column>
            <el-table-column label="温度列表" align="center">
              <template slot-scope="scope">
                <el-button type="success" size="mini" @click="showTemperatureList(scope.row.temperatureList1)">详情
                </el-button>
              </template>
            </el-table-column>

            <el-table-column label="电池箱体编号" width="100" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.bodyNo2 }}</span>
              </template>
            </el-table-column>
            <el-table-column label="温度列表" align="center">
              <template slot-scope="scope">
                <el-button type="success" size="mini" @click="showTemperatureList(scope.row.temperatureList2)">详情
                </el-button>
              </template>
            </el-table-column>

            <el-table-column label="电池箱体编号" width="100" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.bodyNo3 }}</span>
              </template>
            </el-table-column>
            <el-table-column label="温度列表" align="center">
              <template slot-scope="scope">
                <el-button type="success" size="mini" @click="showTemperatureList(scope.row.temperatureList3)">详情
                </el-button>
              </template>
            </el-table-column>

            <el-table-column label="电池箱体编号" width="100" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.bodyNo4 }}</span>
              </template>
            </el-table-column>
            <el-table-column label="温度列表" align="center">
              <template slot-scope="scope">
                <el-button type="success" size="mini" @click="showTemperatureList(scope.row.temperatureList4)">详情
                </el-button>
              </template>
            </el-table-column>
            <el-table-column label="查看所有" align="center">
              <template slot-scope="scope">
                <el-button type="success" size="mini" @click="showAllTemperature(scope.row.batteryTemperatureAll)">
                  查看所有
                </el-button>
              </template>
            </el-table-column>
          </el-table>
          <!--分页-->
          <div class="block">
            <el-pagination
              layout="total, prev, pager, next,sizes, jumper"
              :page-sizes="[10, 20, 30, 50]"
              :current-page.sync="listQuery4.current"
              :page-size="listQuery4.size"
              :total="listQuery4.total"
              @size-change="handleSizeChange4"
              @current-change="handleCurrentChange4"
            />
          </div>
        </el-tab-pane>
        <el-tab-pane label="电池箱运行状态参数" name="4">
          <el-table
            :data="batteryRunStatus"
            style="width: 100%"
            size="mini"
            highlight-current-row
          >
            <el-table-column label="数据时间" width="160" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.dataTime }}</span>
              </template>
            </el-table-column>
            <el-table-column label="电池箱体编号" width="100" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.bodyNo1 }}</span>
              </template>
            </el-table-column>
            <el-table-column label="无符号电流值" width="120" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.current1 * 10 }}</span>
              </template>
            </el-table-column>
            <el-table-column label="SOC" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.soc1 }}%</span>
              </template>
            </el-table-column>
            <el-table-column label="循环次数" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.loopCount1 }}</span>
              </template>
            </el-table-column>
            <el-table-column label="其他状态" align="center">
              <template slot-scope="scope">
                <el-button type="success" size="mini" @click="showRunStatusList(scope.row.allStatus1)">状态</el-button>
              </template>
            </el-table-column>

            <el-table-column label="电池箱体编号" width="100" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.bodyNo2 }}</span>
              </template>
            </el-table-column>
            <el-table-column label="无符号电流值" width="120" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.current2 * 10 }}</span>
              </template>
            </el-table-column>
            <el-table-column label="SOC" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.soc2 }}%</span>
              </template>
            </el-table-column>
            <el-table-column label="循环次数" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.loopCount2 }}</span>
              </template>
            </el-table-column>
            <el-table-column label="其他状态" align="center">
              <template slot-scope="scope">
                <el-button type="success" size="mini" @click="showRunStatusList(scope.row.allStatus2)">状态</el-button>
              </template>
            </el-table-column>

            <el-table-column label="总的状态" align="center">
              <template slot-scope="scope">
                <el-button type="success" size="mini" @click="showRunStatusAll(scope.row.batteryRunStatusAll)">状态
                </el-button>
              </template>
            </el-table-column>

          </el-table>
          <!--分页-->
          <div class="block">
            <el-pagination
              layout="total, prev, pager, next,sizes, jumper"
              :page-sizes="[10, 20, 30, 50]"
              :current-page.sync="listQuery5.current"
              :page-size="listQuery5.size"
              :total="listQuery5.total"
              @size-change="handleSizeChange5"
              @current-change="handleCurrentChange5"
            />
          </div>
        </el-tab-pane>
        <el-tab-pane label="电池箱容量参数" width="120" name="5">
          <el-table
            :data="batteryCapacity"
            style="width: 100%"
            size="mini"
            highlight-current-row
          >
            <el-table-column label="数据时间" width="160" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.dataTime }}</span>
              </template>
            </el-table-column>
            <el-table-column label="电池箱体编号" width="120" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.bodyNo1 }}</span>
              </template>
            </el-table-column>
            <el-table-column label="设计容量" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.designCapacity1 }}</span>
              </template>
            </el-table-column>
            <el-table-column label="满充容量" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.fullCapacity1 }}</span>
              </template>
            </el-table-column>
            <el-table-column label="剩余容量" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.remainingCapacity1 }}</span>
              </template>
            </el-table-column>
            <el-table-column label="电池箱体编号" width="120" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.bodyNo2 }}</span>
              </template>
            </el-table-column>
            <el-table-column label="设计容量" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.designCapacity2 }}</span>
              </template>
            </el-table-column>
            <el-table-column label="满充容量" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.fullCapacity2 }}</span>
              </template>
            </el-table-column>
            <el-table-column label="剩余容量" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.remainingCapacity2 }}</span>
              </template>
            </el-table-column>
            <el-table-column label="电池箱体编号" width="120" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.bodyNo3 }}</span>
              </template>
            </el-table-column>
            <el-table-column label="设计容量" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.designCapacity3 }}</span>
              </template>
            </el-table-column>
            <el-table-column label="满充容量" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.fullCapacity3 }}</span>
              </template>
            </el-table-column>
            <el-table-column label="剩余容量" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.remainingCapacity3 }}</span>
              </template>
            </el-table-column>
            <el-table-column label="总的信息" align="center">
              <template slot-scope="scope">
                <el-button type="success" size="mini" @click="showCapacityAll(scope.row.batteryCapacityAll)">详细
                </el-button>
              </template>
            </el-table-column>
          </el-table>
          <!--分页-->
          <div class="block">
            <el-pagination
              layout="total, prev, pager, next,sizes, jumper"
              :page-sizes="[10, 20, 30, 50]"
              :current-page.sync="listQuery6.current"
              :page-size="listQuery6.size"
              :total="listQuery6.total"
              @size-change="handleSizeChange6"
              @current-change="handleCurrentChange6"
            />
          </div>
        </el-tab-pane>
        <el-tab-pane label="从机通信状态" width="120" name="6">
          <el-table
            :data="slaveCommunication"
            style="width: 100%"
            size="mini"
            highlight-current-row
          >
            <el-table-column label="数据时间" width="160" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.dataTime }}</span>
              </template>
            </el-table-column>
            <el-table-column label="从机1" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.status1 == "1"? "失联":"正常" }}</span>
              </template>
            </el-table-column>
            <el-table-column label="从机2" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.status2 == "1"? "失联":"正常" }}</span>
              </template>
            </el-table-column>
            <el-table-column label="从机3" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.status3 == "1"? "失联":"正常" }}</span>
              </template>
            </el-table-column>
            <el-table-column label="从机4" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.status4 == "1"? "失联":"正常" }}</span>
              </template>
            </el-table-column>
            <el-table-column label="从机5" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.status5 == "1"? "失联":"正常" }}</span>
              </template>
            </el-table-column>
            <el-table-column label="从机6" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.status6 == "1"? "失联":"正常" }}</span>
              </template>
            </el-table-column>
            <el-table-column label="从机7" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.status7 == "1"? "失联":"正常" }}</span>
              </template>
            </el-table-column>
            <el-table-column label="从机8" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.status8 == "1"? "失联":"正常" }}</span>
              </template>
            </el-table-column>
            <el-table-column label="从机9" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.status9 == "1"? "失联":"正常" }}</span>
              </template>
            </el-table-column>
            <el-table-column label="从机10" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.status10 == "1"? "失联":"正常" }}</span>
              </template>
            </el-table-column>

            <el-table-column label="从机11" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.status11 == "1"? "失联":"正常" }}</span>
              </template>
            </el-table-column>
            <el-table-column label="其他" align="center">
              <template slot-scope="scope">
                <el-button type="success" size="mini" @click="showSlaveCommunicationAll(scope.row.statusAll)">详细
                </el-button>
              </template>
            </el-table-column>
          </el-table>
          <!--分页-->
          <div class="block">
            <el-pagination
              layout="total, prev, pager, next,sizes, jumper"
              :page-sizes="[10, 20, 30, 50]"
              :current-page.sync="listQuery7.current"
              :page-size="listQuery7.size"
              :total="listQuery7.total"
              @size-change="handleSizeChange7"
              @current-change="handleCurrentChange7"
            />
          </div>
        </el-tab-pane>
        <el-tab-pane label="故障状态" width="120" name="7">
          <el-table
            :data="faultTable"
            style="width: 100%"
            size="mini"
            highlight-current-row
          >
            <el-table-column label="数据时间" width="160" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.dataTime }}</span>
              </template>
            </el-table-column>
            <el-table-column label="故障项" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.faultList }}</span>
              </template>
            </el-table-column>
          </el-table>
          <!--分页-->
          <div class="block">
            <el-pagination
              layout="total, prev, pager, next,sizes, jumper"
              :page-sizes="[10, 20, 30, 50]"
              :current-page.sync="listQuery9.current"
              :page-size="listQuery9.size"
              :total="listQuery9.total"
              @size-change="handleSizeChange9"
              @current-change="handleCurrentChange9"
            />
          </div>
        </el-tab-pane>
        <el-tab-pane label="EMS-To-PCS 参数" name="8">
          <el-table
            :data="ems2Pcs"
            style="width: 100%"
            size="mini"
            highlight-current-row
          >
            <el-table-column label="数据时间" width="160" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.dataTime }}</span>
              </template>
            </el-table-column>
            <el-table-column label="交流电压给定" width="120" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.acVoltageGive / 10 }}</span>
              </template>
            </el-table-column>
            <el-table-column label="交流有功功率给定" width="140" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.acActivePowerGive }}</span>
              </template>
            </el-table-column>
            <el-table-column label="交流无功功率给定" width="140" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.acReactivePowerGive }}</span>
              </template>
            </el-table-column>
            <el-table-column label="充电截止电压" width="140" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.chargeCutoffVoltage / 10 }}</span>
              </template>
            </el-table-column>
            <el-table-column label="放电截止电压" width="140" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.dischargeCutoffVoltage / 10 }}</span>
              </template>
            </el-table-column>
            <el-table-column label="段1起始时间" width="140" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.startTime1 }}</span>
              </template>
            </el-table-column>
            <el-table-column label="段1终止时间" width="140" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.endTime1 }}</span>
              </template>
            </el-table-column>
            <el-table-column label="段1给定功率" width="140" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.power1 }}</span>
              </template>
            </el-table-column>
            <el-table-column label="段2起始时间" width="120" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.startTime2 }}</span>
              </template>
            </el-table-column>
            <el-table-column label="段2终止时间" width="120" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.endTime2 }}</span>
              </template>
            </el-table-column>
            <el-table-column label="段2给定功率" width="120" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.power2 }}</span>
              </template>
            </el-table-column>
            <el-table-column label="段3起始时间" width="120" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.startTime3 }}</span>
              </template>
            </el-table-column>
            <el-table-column label="段3终止时间" width="120" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.endTime3 }}</span>
              </template>
            </el-table-column>
            <el-table-column label="段3给定功率" width="120" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.power3 }}</span>
              </template>
            </el-table-column>
            <el-table-column label="段4起始时间" width="120" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.startTime4 }}</span>
              </template>
            </el-table-column>
            <el-table-column label="段4终止时间" width="120" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.endTime4 }}</span>
              </template>
            </el-table-column>
            <el-table-column label="段4给定功率" width="120" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.power4 }}</span>
              </template>
            </el-table-column>
            <el-table-column label="段5起始时间" width="120" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.startTime5 }}</span>
              </template>
            </el-table-column>
            <el-table-column label="段5终止时间" width="120" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.endTime5 }}</span>
              </template>
            </el-table-column>
            <el-table-column label="段5给定功率" width="120" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.power5 }}</span>
              </template>
            </el-table-column>
            <el-table-column label="段6起始时间" width="120" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.startTime6 }}</span>
              </template>
            </el-table-column>
            <el-table-column label="段6终止时间" width="120" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.endTime6 }}</span>
              </template>
            </el-table-column>
            <el-table-column label="段6给定功率" width="120" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.power6 }}</span>
              </template>
            </el-table-column>
            <el-table-column label="禁止定时充放" width="120" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.noTimingCharge }}</span>
              </template>
            </el-table-column>
            <el-table-column label="命令控制" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.commandControlName }}</span>
              </template>
            </el-table-column>
          </el-table>
          <!--分页-->
          <div class="block">
            <el-pagination
              layout="total, prev, pager, next,sizes, jumper"
              :page-sizes="[10, 20, 30, 50]"
              :current-page.sync="listQuery8.current"
              :page-size="listQuery8.size"
              :total="listQuery8.total"
              @size-change="handleSizeChange8"
              @current-change="handleCurrentChange8"
            />
          </div>
        </el-tab-pane>

        <!--        <el-collapse-item title="电池箱运行状态" name="4">-->
        <!--          <div>用户决策：根据场景可给予用户操作建议或安全提示，但不能代替用户进行决策；</div>-->
        <!--          <div>结果可控：用户可以自由的进行操作，包括撤销、回退和终止当前操作等。</div>-->
        <!--        </el-collapse-item>-->
        <!--        <el-collapse-item title="电池箱容量参数" name="5">-->
        <!--          <div>用户决策：根据场景可给予用户操作建议或安全提示，但不能代替用户进行决策；</div>-->
        <!--          <div>结果可控：用户可以自由的进行操作，包括撤销、回退和终止当前操作等。</div>-->
        <!--        </el-collapse-item>-->
        <!--        <el-collapse-item title="电池箱运行状态" name="6">-->
        <!--          <div>用户决策：根据场景可给予用户操作建议或安全提示，但不能代替用户进行决策；</div>-->
        <!--          <div>结果可控：用户可以自由的进行操作，包括撤销、回退和终止当前操作等。</div>-->
        <!--        </el-collapse-item>-->
        <!--        <el-collapse-item title="电池箱运行状态" name="7">-->
        <!--          <div>用户决策：根据场景可给予用户操作建议或安全提示，但不能代替用户进行决策；</div>-->
        <!--          <div>结果可控：用户可以自由的进行操作，包括撤销、回退和终止当前操作等。</div>-->
        <!--        </el-collapse-item>-->
      </el-tabs>
    </el-dialog>
    <el-dialog :fullscreen="false" :visible.sync="dialogVisibleVoltage" center width="10%">
      <el-table
        :data="voltageListToShow"
        style="width: 100%"
        size="mini"
        highlight-current-row
      >
        <el-table-column label="电压" width="100" align="center">
          <template slot-scope="scope">
            <span>{{ scope.row }}</span>
          </template>
        </el-table-column>
      </el-table>
    </el-dialog>
    <el-dialog :fullscreen="false" :visible.sync="dialogVisibleVoltageAll" center>
      <el-table
        :data="voltageAllToShow"
        style="width: 100%"
        size="mini"
        highlight-current-row
      >
        <el-table-column label="电池箱体编号" width="100" align="center">
          <template slot-scope="scope">
            <span>{{ scope.row.bodyNo }}</span>
          </template>
        </el-table-column>
        <el-table-column label="总电压" width="100" align="center">
          <template slot-scope="scope">
            <span>{{ scope.row.allVoltage / 10 }}</span>
          </template>
        </el-table-column>
        <el-table-column label="电压列表" align="center">
          <template slot-scope="scope">
            <el-button type="success" size="mini" @click="showVoltageList(scope.row.voltageList)">详情</el-button>
          </template>
        </el-table-column>
      </el-table>
    </el-dialog>

    <el-dialog :fullscreen="false" :visible.sync="dialogVisibleStatus" center width="80%">
      <el-table
        :data="allStatusToShow"
        style="width: 100%"
        size="mini"
        highlight-current-row
      >
        <el-table-column label="放电状态" align="center">
          <template slot-scope="scope">
            <span>{{ scope.row.dischargeSatus == "1"?"放电":"无" }}</span>
          </template>
        </el-table-column>
        <el-table-column label="充电状态" align="center">
          <template slot-scope="scope">
            <span>{{ scope.row.chargeSatus == "1"?"充电":"无" }}</span>
          </template>
        </el-table-column>
        <el-table-column label="MOS 温度状态" width="120" align="center">
          <template slot-scope="scope">
            <span>{{ scope.row.mosTempSatus == "1"?"有":"无" }}</span>
          </template>
        </el-table-column>
        <el-table-column label="环境温度状态" width="120" align="center">
          <template slot-scope="scope">
            <span>{{ scope.row.envTempSatus == "1"?"有":"无" }}</span>
          </template>
        </el-table-column>
        <el-table-column label="电芯过压保护状态" width="120" align="center">
          <template slot-scope="scope">
            <span>{{ scope.row.cellOverVoltageProtection == "1"?"有":"无" }}</span>
          </template>
        </el-table-column>
        <el-table-column label="总压过压保护状态" width="120" align="center">
          <template slot-scope="scope">
            <span>{{ scope.row.allOverVoltageProtection == "1"?"有":"无" }}</span>
          </template>
        </el-table-column>
        <el-table-column label="充满保护状态" width="120" align="center">
          <template slot-scope="scope">
            <span>{{ scope.row.fullProtection == "1"?"有":"无" }}</span>
          </template>
        </el-table-column>
        <el-table-column label="电芯欠压保护状态" width="120" align="center">
          <template slot-scope="scope">
            <span>{{ scope.row.cellUnderVoltageProtection == "1"?"有":"无" }}</span>
          </template>
        </el-table-column>
        <el-table-column label="总压欠压保护状态" width="120" align="center">
          <template slot-scope="scope">
            <span>{{ scope.row.allUnderVoltageProtection == "1"?"有":"无" }}</span>
          </template>
        </el-table-column>
        <el-table-column label="充电温度保护" width="120" align="center">
          <template slot-scope="scope">
            <span>{{ scope.row.chargeTempProtection == "1"?"有":"无" }}</span>
          </template>
        </el-table-column>
        <el-table-column label="放电温度保护" width="120" align="center">
          <template slot-scope="scope">
            <span>{{ scope.row.dischargeTempProtection == "1"?"有":"无" }}</span>
          </template>
        </el-table-column>
        <el-table-column label="MOS 过温保护" width="120" align="center">
          <template slot-scope="scope">
            <span>{{ scope.row.mosOverTempProtection == "1"?"有":"无" }}</span>
          </template>
        </el-table-column>
        <el-table-column label="高温保护状态" width="120" align="center">
          <template slot-scope="scope">
            <span>{{ scope.row.overTempProtection == "1"?"有":"无" }}</span>
          </template>
        </el-table-column>
        <el-table-column label="低温保护状态" width="120" align="center">
          <template slot-scope="scope">
            <span>{{ scope.row.underTempProtection == "1"?"有":"无" }}</span>
          </template>
        </el-table-column>
        <el-table-column label="放电短路保护" width="120" align="center">
          <template slot-scope="scope">
            <span>{{ scope.row.dischargeShortCircuitProtection == "1"?"有":"无" }}</span>
          </template>
        </el-table-column>
        <el-table-column label="放电过流保护" width="120" align="center">
          <template slot-scope="scope">
            <span>{{ scope.row.dischargeOverCurrentProtection == "1"?"有":"无" }}</span>
          </template>
        </el-table-column>
        <el-table-column label="充电过流保护" width="120" align="center">
          <template slot-scope="scope">
            <span>{{ scope.row.chargeOverCurrentProtection == "1"?"有":"无" }}</span>
          </template>
        </el-table-column>
        <el-table-column label="环境高温保护" width="120" align="center">
          <template slot-scope="scope">
            <span>{{ scope.row.envHighTempProtection == "1"?"有":"无" }}</span>
          </template>
        </el-table-column>
        <el-table-column label="环境低温保护" width="120" align="center">
          <template slot-scope="scope">
            <span>{{ scope.row.envLowTempProtection == "1"?"有":"无" }}</span>
          </template>
        </el-table-column>
        <el-table-column label="放电 MOS" width="120" align="center">
          <template slot-scope="scope">
            <span>{{ scope.row.dischargeMos == "1"?"开":"无" }}</span>
          </template>
        </el-table-column>
        <el-table-column label="充电 MOS" width="120" align="center">
          <template slot-scope="scope">
            <span>{{ scope.row.chargeMos == "1"?"开":"无" }}</span>
          </template>
        </el-table-column>
        <el-table-column label="温度采集失效" width="120" align="center">
          <template slot-scope="scope">
            <span>{{ scope.row.cellectTempFail == "1"?"失效，0":"无" }}</span>
          </template>
        </el-table-column>
        <el-table-column label="电压采集失效" width="120" align="center">
          <template slot-scope="scope">
            <span>{{ scope.row.cellectVoltageFail == "1"?"失效，0":"无" }}</span>
          </template>
        </el-table-column>
        <el-table-column label="放电 MOS1" width="120" align="center">
          <template slot-scope="scope">
            <span>{{ scope.row.dischargeMos1 == "1"?"失效，0":"无" }}</span>
          </template>
        </el-table-column>
        <el-table-column label="充电 MOS1" width="120" align="center">
          <template slot-scope="scope">
            <span>{{ scope.row.chargeMos1 == "1"?"失效，0":"无" }}</span>
          </template>
        </el-table-column>
      </el-table>
    </el-dialog>

    <el-dialog :fullscreen="false" :visible.sync="dialogVisibleStatusAll" center width="80%">
      <el-table
        :data="batteryRunStatusAllToShow"
        style="width: 100%"
        size="mini"
        highlight-current-row
      >
        <el-table-column label="电池箱体编号" width="100" align="center">
          <template slot-scope="scope">
            <span>{{ scope.row.bodyNo }}</span>
          </template>
        </el-table-column>
        <el-table-column label="无符号电流值" width="120" align="center">
          <template slot-scope="scope">
            <span>{{ scope.row.current * 10 }}</span>
          </template>
        </el-table-column>
        <el-table-column label="SOC" align="center">
          <template slot-scope="scope">
            <span>{{ scope.row.soc }}%</span>
          </template>
        </el-table-column>
        <el-table-column label="循环次数" align="center">
          <template slot-scope="scope">
            <span>{{ scope.row.loopCount }}</span>
          </template>
        </el-table-column>
        <el-table-column label="放电状态" align="center">
          <template slot-scope="scope">
            <span>{{ scope.row.dischargeSatus == "1"?"放电":"无" }}</span>
          </template>
        </el-table-column>
        <el-table-column label="充电状态" align="center">
          <template slot-scope="scope">
            <span>{{ scope.row.chargeSatus == "1"?"充电":"无" }}</span>
          </template>
        </el-table-column>
        <el-table-column label="MOS 温度状态" width="120" align="center">
          <template slot-scope="scope">
            <span>{{ scope.row.mosTempSatus == "1"?"有":"无" }}</span>
          </template>
        </el-table-column>
        <el-table-column label="环境温度状态" width="120" align="center">
          <template slot-scope="scope">
            <span>{{ scope.row.envTempSatus == "1"?"有":"无" }}</span>
          </template>
        </el-table-column>
        <el-table-column label="电芯过压保护状态" width="120" align="center">
          <template slot-scope="scope">
            <span>{{ scope.row.cellOverVoltageProtection == "1"?"有":"无" }}</span>
          </template>
        </el-table-column>
        <el-table-column label="总压过压保护状态" width="120" align="center">
          <template slot-scope="scope">
            <span>{{ scope.row.allOverVoltageProtection == "1"?"有":"无" }}</span>
          </template>
        </el-table-column>
        <el-table-column label="充满保护状态" width="120" align="center">
          <template slot-scope="scope">
            <span>{{ scope.row.fullProtection == "1"?"有":"无" }}</span>
          </template>
        </el-table-column>
        <el-table-column label="电芯欠压保护状态" width="120" align="center">
          <template slot-scope="scope">
            <span>{{ scope.row.cellUnderVoltageProtection == "1"?"有":"无" }}</span>
          </template>
        </el-table-column>
        <el-table-column label="总压欠压保护状态" width="120" align="center">
          <template slot-scope="scope">
            <span>{{ scope.row.allUnderVoltageProtection == "1"?"有":"无" }}</span>
          </template>
        </el-table-column>
        <el-table-column label="充电温度保护" width="120" align="center">
          <template slot-scope="scope">
            <span>{{ scope.row.chargeTempProtection == "1"?"有":"无" }}</span>
          </template>
        </el-table-column>
        <el-table-column label="放电温度保护" width="120" align="center">
          <template slot-scope="scope">
            <span>{{ scope.row.dischargeTempProtection == "1"?"有":"无" }}</span>
          </template>
        </el-table-column>
        <el-table-column label="MOS 过温保护" width="120" align="center">
          <template slot-scope="scope">
            <span>{{ scope.row.mosOverTempProtection == "1"?"有":"无" }}</span>
          </template>
        </el-table-column>
        <el-table-column label="高温保护状态" width="120" align="center">
          <template slot-scope="scope">
            <span>{{ scope.row.overTempProtection == "1"?"有":"无" }}</span>
          </template>
        </el-table-column>
        <el-table-column label="低温保护状态" width="120" align="center">
          <template slot-scope="scope">
            <span>{{ scope.row.underTempProtection == "1"?"有":"无" }}</span>
          </template>
        </el-table-column>
        <el-table-column label="放电短路保护" width="120" align="center">
          <template slot-scope="scope">
            <span>{{ scope.row.dischargeShortCircuitProtection == "1"?"有":"无" }}</span>
          </template>
        </el-table-column>
        <el-table-column label="放电过流保护" width="120" align="center">
          <template slot-scope="scope">
            <span>{{ scope.row.dischargeOverCurrentProtection == "1"?"有":"无" }}</span>
          </template>
        </el-table-column>
        <el-table-column label="充电过流保护" width="120" align="center">
          <template slot-scope="scope">
            <span>{{ scope.row.chargeOverCurrentProtection == "1"?"有":"无" }}</span>
          </template>
        </el-table-column>
        <el-table-column label="环境高温保护" width="120" align="center">
          <template slot-scope="scope">
            <span>{{ scope.row.envHighTempProtection == "1"?"有":"无" }}</span>
          </template>
        </el-table-column>
        <el-table-column label="环境低温保护" width="120" align="center">
          <template slot-scope="scope">
            <span>{{ scope.row.envLowTempProtection == "1"?"有":"无" }}</span>
          </template>
        </el-table-column>
        <el-table-column label="放电 MOS" width="120" align="center">
          <template slot-scope="scope">
            <span>{{ scope.row.dischargeMos == "1"?"开":"无" }}</span>
          </template>
        </el-table-column>
        <el-table-column label="充电 MOS" width="120" align="center">
          <template slot-scope="scope">
            <span>{{ scope.row.chargeMos == "1"?"开":"无" }}</span>
          </template>
        </el-table-column>
        <el-table-column label="温度采集失效" width="120" align="center">
          <template slot-scope="scope">
            <span>{{ scope.row.cellectTempFail == "1"?"失效，0":"无" }}</span>
          </template>
        </el-table-column>
        <el-table-column label="电压采集失效" width="120" align="center">
          <template slot-scope="scope">
            <span>{{ scope.row.cellectVoltageFail == "1"?"失效，0":"无" }}</span>
          </template>
        </el-table-column>
        <el-table-column label="放电 MOS1" width="120" align="center">
          <template slot-scope="scope">
            <span>{{ scope.row.dischargeMos1 == "1"?"失效，0":"无" }}</span>
          </template>
        </el-table-column>
        <el-table-column label="充电 MOS1" width="120" align="center">
          <template slot-scope="scope">
            <span>{{ scope.row.chargeMos1 == "1"?"失效，0":"无" }}</span>
          </template>
        </el-table-column>

      </el-table>
    </el-dialog>

    <el-dialog :fullscreen="false" :visible.sync="dialogVisibleTemperature" center width="10%">
      <el-table
        :data="temperatureListToShow"
        style="width: 100%"
        size="mini"
        highlight-current-row
      >
        <el-table-column label="温度" width="100" align="center">
          <template slot-scope="scope">
            <span>{{ scope.row }}</span>
          </template>
        </el-table-column>
      </el-table>
    </el-dialog>
    <el-dialog :fullscreen="false" :visible.sync="dialogVisibleTemperatureAll" center>
      <el-table
        :data="temperatureAllToShow"
        style="width: 100%"
        size="mini"
        highlight-current-row
      >
        <el-table-column label="电池箱体编号" width="100" align="center">
          <template slot-scope="scope">
            <span>{{ scope.row.bodyNo }}</span>
          </template>
        </el-table-column>
        <el-table-column label="温度列表" align="center">
          <template slot-scope="scope">
            <el-button type="success" size="mini" @click="showTemperatureList(scope.row.temperatureList)">详情</el-button>
          </template>
        </el-table-column>
      </el-table>
    </el-dialog>
    <el-dialog :fullscreen="false" :visible.sync="dialogVisibleCapacityAll" center>
      <el-table
        :data="batteryCapacityAllToShow"
        style="width: 100%"
        size="mini"
        highlight-current-row
      >
        <el-table-column label="电池箱体编号" width="120" align="center">
          <template slot-scope="scope">
            <span>{{ scope.row.bodyNo }}</span>
          </template>
        </el-table-column>
        <el-table-column label="设计容量" align="center">
          <template slot-scope="scope">
            <span>{{ scope.row.designCapacity }}</span>
          </template>
        </el-table-column>
        <el-table-column label="满充容量" align="center">
          <template slot-scope="scope">
            <span>{{ scope.row.fullCapacity }}</span>
          </template>
        </el-table-column>
        <el-table-column label="剩余容量" align="center">
          <template slot-scope="scope">
            <span>{{ scope.row.remainingCapacity }}</span>
          </template>
        </el-table-column>
      </el-table>
    </el-dialog>
    <el-dialog :fullscreen="false" :visible.sync="dialogVisibleSlaveCommunicationAll" center width="15%">
      <el-table
        :data="slaveCommunicationAllToShow"
        style="width: 100%"
        size="mini"
        highlight-current-row
      >
        <el-table-column label="序号" width="60" align="center">
          <template slot-scope="scope">
            <span>{{ scope.$index + 1 }}</span>
          </template>
        </el-table-column>
        <el-table-column label="从机运行状态" width="120" align="center">
          <template slot-scope="scope">
            <span>{{ scope.row == "1"? "失联":"正常" }}</span>
          </template>
        </el-table-column>
      </el-table>
    </el-dialog>
  </div>
</template>

<script>
import { query, getById, getRealTimeById, getHistoryByVin } from '@/api/battery/data'
import LineChart from './LineChart'
import PolylineChart from './PolylineChart'

export default {
  components: {
    LineChart,
    PolylineChart
  },
  data() {
    return {
      vin: '',
      id: '',
      dialogVisibleVoltage: false,
      dialogVisibleVoltageAll: false,
      dialogVisibleTemperature: false,
      dialogVisibleTemperatureAll: false,
      dialogVisibleStatus: false,
      dialogVisibleStatusAll: false,
      dialogVisibleCapacityAll: false,
      dialogVisibleSlaveCommunicationAll: false,
      voltageListToShow: [],
      temperatureListToShow: [],
      voltageAllToShow: [],
      temperatureAllToShow: [],
      allStatusToShow: [],
      batteryRunStatusAllToShow: [],
      batteryCapacityAllToShow: [],
      slaveCommunicationAllToShow: [],
      battery: '80%',
      activeNames: '0',
      lineChartData: {},
      lineChartData2: {},
      tableData: [],
      allParameters: [null],
      energyStorage: [null],
      batteryVoltage: [],
      batteryTemperature: [],
      batteryRunStatus: [],
      batteryCapacity: [],
      slaveCommunication: [],
      ems2Pcs: [null],
      faultTable: [],
      // 选中的弹窗参数
      selectedData: {},
      dialogVisible: false, // 控制弹出框
      realTimeData: {
        user: '',
        SOC: '',
        batteryCapacity: '',
        batteryType: '',
        highTemperature: '',
        iccid: '',
        putTime: '',
        voltage: '',
        electricCurrent: '',
        runStatus: '',
        imei: '',
        dataTime: ''
      },
      historyData: {
        user: '',
        SOC: ''
      },
      activeName: 'realTime',
      listQuery: {
        total: 0,
        current: 1,
        size: 20,
        vin: ''
      },
      listQuery1: {
        total: 0,
        current: 1,
        size: 20,
        vin: ''
      },
      listQuery2: {
        total: 0,
        current: 1,
        size: 20,
        vin: ''
      },
      listQuery3: {
        total: 0,
        current: 1,
        size: 20,
        vin: ''
      },
      listQuery4: {
        total: 0,
        current: 1,
        size: 20,
        vin: ''
      },
      listQuery5: {
        total: 0,
        current: 1,
        size: 20,
        vin: ''
      },
      listQuery6: {
        total: 0,
        current: 1,
        size: 20,
        vin: ''
      },
      listQuery7: {
        total: 0,
        current: 1,
        size: 20,
        vin: ''
      },
      listQuery8: {
        total: 0,
        current: 1,
        size: 20,
        vin: ''
      },
      listQuery9: {
        total: 0,
        current: 1,
        size: 20,
        vin: ''
      },

      loading: false,
      batteryIdTemp: -1,
      polylineChartData: {
        newVisitis: {
          expectedData: [100, 120, 161, 134, 105, 160, 165, 100],
          actualData: [130, 82, 91, 154, 162, 140, 145, 100],
          actualData1: [150, 92, 101, 104, 172, 190, 195, 180]
        }
      }
    }
  },
  created() {
    this.getList()
  },
  mounted() {
    this.setMychart()
  },
  methods: {
    getList: function() {
      this.loading = true
      query(this.listQuery).then(response => {
        this.loading = false
        const records = []
        for (let i = 0; i < response.data.data.records.length; i++) {
          const record = response.data.data.records[i]
          record['runModelName'] = this.getRunModelName(record['runModel'])
          record['alarmName'] = this.getRunModelName(record['alarm'])
          records[i] = record
        }
        this.tableData = records
        this.listQuery.total = response.data.data.total
      })
    },
    handleClick(tab, event) {
      this.setMychart()
      if (tab.paneName === 'history') {
        getHistoryById(this.batteryIdTemp).then(response => {
          if (response.data.code !== 200) {
            this.$message({
              type: 'warning',
              message: '未找到数据'
            })
          } else {
            this.historyData = response.data.data
            this.lineChartData = {
              // batteryData: response.data.data.realTimeData.split(',')
              batteryData: [16, 13, 6, 18, 10, 1, 19, 13, 12, 14, 16, 6, 11]
            }
          }
        })
      }
    },
    setMychart() {
      var myEvent = new Event('resize')
      window.dispatchEvent(myEvent)
    },

    // 搜索
    handleFind: function() {
      this.getList()
    },
    showVoltageList: function(e) {
      this.voltageListToShow = e
      this.dialogVisibleVoltage = true
    },
    showAllVoltage: function(e) {
      this.voltageAllToShow = e
      this.dialogVisibleVoltageAll = true
    },
    showTemperatureList: function(e) {
      this.temperatureListToShow = e
      this.dialogVisibleTemperature = true
    },
    showAllTemperature: function(e) {
      this.temperatureAllToShow = e
      this.dialogVisibleTemperatureAll = true
    },
    showRunStatusList: function(e) {
      this.allStatusToShow[0] = e
      this.dialogVisibleStatus = true
    },
    showRunStatusAll: function(e) {
      this.batteryRunStatusAllToShow = e
      this.dialogVisibleStatusAll = true
    },
    showCapacityAll: function(e) {
      this.batteryCapacityAllToShow = e
      this.dialogVisibleCapacityAll = true
    },
    showSlaveCommunicationAll: function(e) {
      this.slaveCommunicationAllToShow = e
      this.dialogVisibleSlaveCommunicationAll = true
    },
    handleView(row) {
      this.vin = row.vin
      this.id = row.id
      // 设置选中的行参数，用于在弹窗头部展示
      this.selectedData = row
      this.selectedData['runModelName'] = this.getRunModelName(this.selectedData['runModel'])
      let listQuery = {}
      switch (this.activeNames) {
        case '0': {
          listQuery = this.listQuery1
          break
        }
        case '1': {
          listQuery = this.listQuery2
          break
        }
        case '2': {
          listQuery = this.listQuery3
          break
        }
        case '3': {
          listQuery = this.listQuery4
          break
        }
        case '4': {
          listQuery = this.listQuery5
          break
        }
        case '5': {
          listQuery = this.listQuery6
          break
        }
        case '6': {
          listQuery = this.listQuery7
          break
        }
        case '7': {
          listQuery = this.listQuery9
          break
        }
        case '8': {
          listQuery = this.listQuery8
          break
        }
      }
      this.getHistoryAAAA(listQuery, row.vin)
    },
    getRunStatusName: function(runStatus) {
      switch (runStatus) {
        case 1:
          return '停机'
        case 2:
          return '开机自检'
        case 3:
          return '预工作'
        case 4:
          return '工作'
        case 5:
          return '故障'
        case 6:
          return '故障闭锁'
        default:
          return '未定义'
      }
    },
    getRunModelName: function(runModel) {
      switch (runModel) {
        case 1:
          return '并网 PQ 模式'
        case 2:
          return '离网 VF 模式'
        default:
          return '未定义'
      }
    },
    getCommandControlName: function(commandControl) {
      switch (commandControl) {
        case 0:
          return '无动作'
        case 1:
          return '开机'
        case 2:
          return '关机'
        default:
          return '未定义'
      }
    },
    handleChange(val) {
      this.handleView(this.selectedData)
    },
    // 换页
    handleCurrentChange: function(val) {
      this.listQuery.current = val
      this.getList()
    },
    // 换页数
    handleSizeChange(val) {
      this.listQuery.size = val
      this.getList()
    },
    // 换页
    handleCurrentChange1: function(val) {
      this.listQuery.current = val
      this.getHistoryAAAA(this.listQuery1, this.vin)
    },
    // 换页数
    handleSizeChange1(val) {
      this.listQuery.size = val
      this.getHistoryAAAA(this.listQuery1, this.vin)
    },
    // 换页
    handleCurrentChange2: function(val) {
      this.listQuery.current = val
      this.getHistoryAAAA(this.listQuery2, this.vin)
    },
    // 换页数
    handleSizeChange2(val) {
      this.listQuery.size = val
      this.getHistoryAAAA(this.listQuery2, this.vin)
    },
    // 换页
    handleCurrentChange3: function(val) {
      this.listQuery.current = val
      this.getHistoryAAAA(this.listQuery3, this.vin)
    },
    // 换页数
    handleSizeChange3(val) {
      this.listQuery.size = val
      this.getHistoryAAAA(this.listQuery3, this.vin)
    },
    // 换页
    handleCurrentChange4: function(val) {
      this.listQuery.current = val
      this.getHistoryAAAA(this.listQuery4, this.vin)
    },
    // 换页数
    handleSizeChange4(val) {
      this.listQuery.size = val
      this.getHistoryAAAA(this.listQuery4, this.vin)
    },
    // 换页
    handleCurrentChange5: function(val) {
      this.listQuery.current = val
      this.getHistoryAAAA(this.listQuery5, this.vin)
    },
    // 换页数
    handleSizeChange5(val) {
      this.listQuery.size = val
      this.getHistoryAAAA(this.listQuery5, this.vin)
    },
    // 换页
    handleCurrentChange6: function(val) {
      this.listQuery.current = val
      this.getHistoryAAAA(this.listQuery6, this.vin)
    },
    // 换页数
    handleSizeChange6(val) {
      this.listQuery.size = val
      this.getHistoryAAAA(this.listQuery6, this.vin)
    },
    // 换页
    handleCurrentChange7: function(val) {
      this.listQuery.current = val
      this.getHistoryAAAA(this.listQuery7, this.vin)
    },
    // 换页数
    handleSizeChange7(val) {
      this.listQuery.size = val
      this.getHistoryAAAA(this.listQuery7, this.vin)
    },
    // 换页
    handleCurrentChange8: function(val) {
      this.listQuery.current = val
      this.getHistoryAAAA(this.listQuery8, this.vin)
    },
    // 换页数
    handleSizeChange8(val) {
      this.listQuery.size = val
      this.getHistoryAAAA(this.listQuery8, this.vin)
    },
    // 换页
    handleCurrentChange9: function(val) {
      this.listQuery.current = val
      this.getHistoryAAAA(this.listQuery9, this.vin)
    },
    // 换页数
    handleSizeChange9(val) {
      this.listQuery.size = val
      this.getHistoryAAAA(this.listQuery9, this.vin)
    },
    refreshTopData(id) {
      getById(id).then(response => {
        this.selectedData = response.data.data
        this.selectedData['runModelName'] = this.getRunModelName(this.selectedData['runModel'])
      })
    },
    getHistoryAAAA(listQuery, vin) {
      getHistoryByVin(listQuery, vin).then(response => {
        if (response.data.code === 200) {
          const test = response.data.data.records
          switch (this.activeNames) {
            case '0': {
              this.allParameters = []
              this.listQuery1.total = response.data.data.total
              break
            }
            case '1': {
              this.energyStorage = []
              this.listQuery2.total = response.data.data.total
              break
            }
            case '2': {
              this.batteryVoltage = []
              this.listQuery3.total = response.data.data.total
              break
            }
            case '3': {
              this.batteryTemperature = []
              this.listQuery4.total = response.data.data.total
              break
            }
            case '4': {
              this.batteryRunStatus = []
              this.listQuery5.total = response.data.data.total
              break
            }
            case '5': {
              this.batteryCapacity = []
              this.listQuery6.total = response.data.data.total
              break
            }
            case '6': {
              this.slaveCommunication = []
              this.listQuery7.total = response.data.data.total
              break
            }
            case '7': {
              this.faultTable = []
              this.listQuery9.total = response.data.data.total
              break
            }
            case '8': {
              this.ems2Pcs = []
              this.listQuery8.total = response.data.data.total
              break
            }
          }
          for (let i = 0; i < test.length; i++) {
            this.allParameters[i] = JSON.parse(test[i].allParameters)
            this.allParameters[i]['dataTime'] = test[i].dataTime
            this.allParameters[i]['runStatusName'] = this.getRunStatusName(this.allParameters[i]['runStatus'])
            this.allParameters[i]['runModelName'] = this.getRunModelName(this.allParameters[i]['runModel'])
            this.energyStorage[i] = JSON.parse(test[i].energyStorage)
            this.energyStorage[i]['dataTime'] = test[i].dataTime
            this.ems2Pcs[i] = JSON.parse(test[i].ems2Pcs)
            this.ems2Pcs[i]['dataTime'] = test[i].dataTime
            this.ems2Pcs[i]['commandControlName'] = this.getCommandControlName(this.ems2Pcs[i].commandControl)
            this.faultTable[i] = JSON.parse(test[i].allFault)
            this.faultTable[i]['dataTime'] = test[i].dataTime
            // 电池电压
            // 取前四个
            const batteryVoltageList = JSON.parse(test[i].batteryBodyVoltage).batteryVoltageList
            const batteryVoltageOne = {}
            batteryVoltageOne['dataTime'] = test[i].dataTime
            if (batteryVoltageList[0] != undefined) {
              batteryVoltageOne['bodyNo1'] = batteryVoltageList[0].bodyNo
              batteryVoltageOne['allVoltage1'] = batteryVoltageList[0].allVoltage
              batteryVoltageOne['voltageList1'] = batteryVoltageList[0].voltageList
            }
            if (batteryVoltageList[1] != undefined) {
              batteryVoltageOne['bodyNo2'] = batteryVoltageList[1].bodyNo
              batteryVoltageOne['allVoltage2'] = batteryVoltageList[1].allVoltage
              batteryVoltageOne['voltageList2'] = batteryVoltageList[1].voltageList
            }
            if (batteryVoltageList[2] != undefined) {
              batteryVoltageOne['bodyNo3'] = batteryVoltageList[2].bodyNo
              batteryVoltageOne['allVoltage3'] = batteryVoltageList[2].allVoltage
              batteryVoltageOne['voltageList3'] = batteryVoltageList[2].voltageList
            }
            if (batteryVoltageList[3] != undefined) {
              batteryVoltageOne['bodyNo4'] = batteryVoltageList[3].bodyNo
              batteryVoltageOne['allVoltage4'] = batteryVoltageList[3].allVoltage
              batteryVoltageOne['voltageList4'] = batteryVoltageList[3].voltageList
            }
            batteryVoltageOne['voltageAll'] = batteryVoltageList
            this.batteryVoltage[i] = batteryVoltageOne

            // 电池温度
            // 取前四个
            const batteryTemperatureList = JSON.parse(test[i].batteryBodyTemperature).batteryTemperatureList
            const batteryTemperatureOne = {}
            batteryTemperatureOne['dataTime'] = test[i].dataTime
            if (batteryTemperatureList[0] != undefined) {
              batteryTemperatureOne['bodyNo1'] = batteryTemperatureList[0].bodyNo
              batteryTemperatureOne['sensorCount1'] = batteryTemperatureList[0].sensorCount
              batteryTemperatureOne['temperatureList1'] = batteryTemperatureList[0].temperatureList
            }
            if (batteryTemperatureList[1] != undefined) {
              batteryTemperatureOne['bodyNo2'] = batteryTemperatureList[1].bodyNo
              batteryTemperatureOne['sensorCount2'] = batteryTemperatureList[1].sensorCount
              batteryTemperatureOne['temperatureList2'] = batteryTemperatureList[1].temperatureList
            }
            if (batteryTemperatureList[2] != undefined) {
              batteryTemperatureOne['bodyNo3'] = batteryTemperatureList[2].bodyNo
              batteryTemperatureOne['sensorCount3'] = batteryTemperatureList[2].sensorCount
              batteryTemperatureOne['temperatureList3'] = batteryTemperatureList[2].temperatureList
            }
            if (batteryTemperatureList[3] != undefined) {
              batteryTemperatureOne['bodyNo4'] = batteryTemperatureList[3].bodyNo
              batteryTemperatureOne['sensorCount4'] = batteryTemperatureList[3].sensorCount
              batteryTemperatureOne['temperatureList4'] = batteryTemperatureList[3].temperatureList
            }
            batteryTemperatureOne['batteryTemperatureAll'] = batteryTemperatureList
            this.batteryTemperature[i] = batteryTemperatureOne

            // 电池运行状态
            const batteryRunStatusList = JSON.parse(test[i].batteryBodyRunStatus).batteryRunStatusList
            const batteryRunStatusOne = {}
            batteryRunStatusOne['dataTime'] = test[i].dataTime
            if (batteryRunStatusList[0] != undefined) {
              batteryRunStatusOne['bodyNo1'] = batteryRunStatusList[0].bodyNo
              batteryRunStatusOne['current1'] = batteryRunStatusList[0].current
              batteryRunStatusOne['soc1'] = batteryRunStatusList[0].soc
              batteryRunStatusOne['loopCount1'] = batteryRunStatusList[0].loopCount
              batteryRunStatusOne['allStatus1'] = batteryRunStatusList[0]
            }
            if (batteryRunStatusList[1] != undefined) {
              batteryRunStatusOne['bodyNo2'] = batteryRunStatusList[1].bodyNo
              batteryRunStatusOne['current2'] = batteryRunStatusList[1].current
              batteryRunStatusOne['soc2'] = batteryRunStatusList[1].soc
              batteryRunStatusOne['loopCount2'] = batteryRunStatusList[1].loopCount
              batteryRunStatusOne['allStatus2'] = batteryRunStatusList[1]
            }
            batteryRunStatusOne['batteryRunStatusAll'] = batteryRunStatusList
            this.batteryRunStatus[i] = batteryRunStatusOne

            // 电池箱容量
            const batteryCapacityList = JSON.parse(test[i].batteryBodyCapacity).batteryCapacityList
            const batteryCapacityOne = {}
            batteryCapacityOne['dataTime'] = test[i].dataTime
            if (batteryRunStatusList[1] != undefined) {
              batteryCapacityOne['bodyNo1'] = batteryCapacityList[0].bodyNo
              batteryCapacityOne['designCapacity1'] = batteryCapacityList[0].designCapacity
              batteryCapacityOne['fullCapacity1'] = batteryCapacityList[0].fullCapacity
              batteryCapacityOne['remainingCapacity1'] = batteryCapacityList[0].remainingCapacity
            }
            if (batteryRunStatusList[1] != undefined) {
              batteryCapacityOne['bodyNo2'] = batteryCapacityList[1].bodyNo
              batteryCapacityOne['designCapacity2'] = batteryCapacityList[1].designCapacity
              batteryCapacityOne['fullCapacity2'] = batteryCapacityList[1].fullCapacity
              batteryCapacityOne['remainingCapacity2'] = batteryCapacityList[1].remainingCapacity
            }
            if (batteryRunStatusList[1] != undefined) {
              batteryCapacityOne['bodyNo3'] = batteryCapacityList[2].bodyNo
              batteryCapacityOne['designCapacity3'] = batteryCapacityList[2].designCapacity
              batteryCapacityOne['fullCapacity3'] = batteryCapacityList[2].fullCapacity
              batteryCapacityOne['remainingCapacity3'] = batteryCapacityList[2].remainingCapacity
            }
            batteryCapacityOne['batteryCapacityAll'] = batteryCapacityList
            this.batteryCapacity[i] = batteryCapacityOne

            // 从机通信
            const runStatusList = JSON.parse(test[i].slaveCommunicationStatus).runStatusList
            const runStatusOne = {}

            runStatusOne['dataTime'] = test[i].dataTime
            runStatusOne['status1'] = runStatusList[0]
            runStatusOne['status2'] = runStatusList[1]
            runStatusOne['status3'] = runStatusList[2]
            runStatusOne['status4'] = runStatusList[3]
            runStatusOne['status5'] = runStatusList[4]
            runStatusOne['status6'] = runStatusList[5]
            runStatusOne['status7'] = runStatusList[6]
            runStatusOne['status8'] = runStatusList[7]
            runStatusOne['status9'] = runStatusList[8]
            runStatusOne['status10'] = runStatusList[9]
            runStatusOne['status11'] = runStatusList[10]
            runStatusOne['statusAll'] = runStatusList
            this.slaveCommunication[i] = runStatusOne
          }
          this.dialogVisible = true
        } else {
          this.$message({
            type: 'warning',
            message: '未找到数据'
          })
        }
        this.refreshTopData(this.id)
      })
    }
  }
}
</script>
<style>
  .battery-icon {
    position: relative;
    width: 130px;
    height: 50px;
    background: #dedede;
    border-radius: 10px;
    /* overflow: hidden; */
    /* border: 1px solid red; */
  }

  .power-num {
    border-radius: 10px;
    position: absolute;
    right: -40%;
    top: 50%;
    transform: translateY(-50%);
    font-size: 15px;
    line-height: 30px;
    height: 30px;
    width: 30px;
  }

  .battery-num {
    background: #378b2d;
    height: 100%;
    border-radius: 10px 0 0 10px;
  }

  .battery-num.full {
    border-radius: 10px;
  }

  .battery-head {
    width: 6px;
    height: 13px;
    background: #dedede;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: -6px;
    border-radius: 0 2px 2px 0;
  }

  .battery-head.full {
    background: #378b2d;
  }

  .echarts {
    width: 300px;
    height: 150px;
  }
</style>
